<template>
  <view>
    <view class="flex flex-justify-between mx-4 my-2rpx flex-items-center">
      <text class="text-lg font-size-3 font-800">数据上传</text>
    </view>
    <FormCore :fields="formFields" :initial-values="formData" @submit="submit"></FormCore>
  </view>
</template>

<script lang="ts" setup>
import { ref, reactive, computed, onMounted, watch } from 'vue'
import FormCore from '../components/FormCore.vue'
import type { FormField } from '../components/types'
const formData = ref({
  dateTime: null,
  attachments: []
})
onMounted(() => {
  const savedData = uni.getStorageSync('formDataYKC')
  if (savedData) {
    formData.value.dateTime = savedData._value.dateTime
    formData.value.attachments = savedData._value.attachments
    console.log(formData.value)
  }
})

const formFields: FormField[] = [
  {
    fieldType: 'date',
    name: 'dateTime',
    prop: 'dateTime',
    label: '勘察日期',
    placeholder: '请选择勘察日期',
    rules: [{ required: true, message: '必填字段' }]
  },
  {
    fieldType: 'upload',
    name: 'attachments',
    prop: 'attachments',
    label: '现场勘察预算表',
    uploadConfig: {
      action: 'https://mockapi.eolink.com/zhTuw2P8c29bc981a741931bdd86eb04dc1e8fd64865cb5/upload',
      maxCount: 5,
      accept: 'all'
    },
    rules: [{ required: true, message: '必填字段' }]
  }
]
const submit = ({ formRef, formData }) => {
  uni.setStorageSync('formDataYKC', formData)
}
</script>

<style lang="scss" scoped></style>
